<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
      <el-form-item label="serial_no" prop="serialNo">
        <el-input
          v-model="queryParams.serialNo"
          placeholder="请输入serial_no"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="event_type" prop="eventType">
        <el-select v-model="queryParams.eventType" placeholder="请选择event_type" clearable size="small">
          <el-option label="请选择字典生成" value=""/>
        </el-select>
      </el-form-item>
      <el-form-item label="event_source" prop="eventSource">
        <el-input
          v-model="queryParams.eventSource"
          placeholder="请输入event_source"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="user_id" prop="userId">
        <el-input
          v-model="queryParams.userId"
          placeholder="请输入user_id"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="cust_no" prop="custNo">
        <el-input
          v-model="queryParams.custNo"
          placeholder="请输入cust_no"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
<!--      <el-form-item label="account_number" prop="accountNumber">-->
<!--        <el-input-->
<!--          v-model="queryParams.accountNumber"-->
<!--          placeholder="请输入account_number"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="account_name" prop="accountName">-->
<!--        <el-input-->
<!--          v-model="queryParams.accountName"-->
<!--          placeholder="请输入account_name"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="fees" prop="fees">-->
<!--        <el-input-->
<!--          v-model="queryParams.fees"-->
<!--          placeholder="请输入fees"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="requested_amount" prop="requestedAmount">-->
<!--        <el-input-->
<!--          v-model="queryParams.requestedAmount"-->
<!--          placeholder="请输入requested_amount"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--&lt;!&ndash;      <el-form-item label="amount" prop="amount">&ndash;&gt;-->
<!--&lt;!&ndash;        <el-input&ndash;&gt;-->
<!--&lt;!&ndash;          v-model="queryParams.amount"&ndash;&gt;-->
<!--&lt;!&ndash;          placeholder="请输入amount"&ndash;&gt;-->
<!--&lt;!&ndash;          clearable&ndash;&gt;-->
<!--&lt;!&ndash;          size="small"&ndash;&gt;-->
<!--&lt;!&ndash;          @keyup.enter.native="handleQuery"&ndash;&gt;-->
<!--&lt;!&ndash;        />&ndash;&gt;-->
<!--&lt;!&ndash;      </el-form-item>&ndash;&gt;-->
<!--      <el-form-item label="currency" prop="currency">-->
<!--        <el-input-->
<!--          v-model="queryParams.currency"-->
<!--          placeholder="请输入currency"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="bank_code" prop="bankCode">-->
<!--        <el-input-->
<!--          v-model="queryParams.bankCode"-->
<!--          placeholder="请输入bank_code"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="gateway_response" prop="gatewayResponse">-->
<!--        <el-input-->
<!--          v-model="queryParams.gatewayResponse"-->
<!--          placeholder="请输入gateway_response"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="bin" prop="bin">-->
<!--        <el-input-->
<!--          v-model="queryParams.bin"-->
<!--          placeholder="请输入bin"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="last4" prop="last4">-->
<!--        <el-input-->
<!--          v-model="queryParams.last4"-->
<!--          placeholder="请输入last4"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="exp_month" prop="expMonth">-->
<!--        <el-input-->
<!--          v-model="queryParams.expMonth"-->
<!--          placeholder="请输入exp_month"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="exp_year" prop="expYear">-->
<!--        <el-input-->
<!--          v-model="queryParams.expYear"-->
<!--          placeholder="请输入exp_year"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="card_type" prop="cardType">-->
<!--        <el-select v-model="queryParams.cardType" placeholder="请选择card_type" clearable size="small">-->
<!--          <el-option label="请选择字典生成" value=""/>-->
<!--        </el-select>-->
<!--      </el-form-item>-->
<!--      <el-form-item label="country_code" prop="countryCode">-->
<!--        <el-input-->
<!--          v-model="queryParams.countryCode"-->
<!--          placeholder="请输入country_code"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="brand" prop="brand">-->
<!--        <el-input-->
<!--          v-model="queryParams.brand"-->
<!--          placeholder="请输入brand"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="bank_name" prop="bankName">-->
<!--        <el-input-->
<!--          v-model="queryParams.bankName"-->
<!--          placeholder="请输入bank_name"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="reusable" prop="reusable">-->
<!--        <el-input-->
<!--          v-model="queryParams.reusable"-->
<!--          placeholder="请输入reusable"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="authorization_code" prop="authorizationCode">-->
<!--        <el-input-->
<!--          v-model="queryParams.authorizationCode"-->
<!--          placeholder="请输入authorization_code"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="channel" prop="channel">-->
<!--        <el-input-->
<!--          v-model="queryParams.channel"-->
<!--          placeholder="请输入channel"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="id" prop="transId">-->
<!--        <el-input-->
<!--          v-model="queryParams.transId"-->
<!--          placeholder="请输入id"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="ip_address" prop="ipAddress">-->
<!--        <el-input-->
<!--          v-model="queryParams.ipAddress"-->
<!--          placeholder="请输入ip_address"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="尝试次数" prop="attempts">-->
<!--        <el-input-->
<!--          v-model="queryParams.attempts"-->
<!--          placeholder="请输入尝试次数"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="authentication" prop="authentication">-->
<!--        <el-input-->
<!--          v-model="queryParams.authentication"-->
<!--          placeholder="请输入authentication"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="risk_action" prop="riskAction">-->
<!--        <el-input-->
<!--          v-model="queryParams.riskAction"-->
<!--          placeholder="请输入risk_action"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="customer_code" prop="customerCode">-->
<!--        <el-input-->
<!--          v-model="queryParams.customerCode"-->
<!--          placeholder="请输入customer_code"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="first_name" prop="firstName">-->
<!--        <el-input-->
<!--          v-model="queryParams.firstName"-->
<!--          placeholder="请输入first_name"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="middle_name" prop="middleName">-->
<!--        <el-input-->
<!--          v-model="queryParams.middleName"-->
<!--          placeholder="请输入middle_name"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="last_name" prop="lastName">-->
<!--        <el-input-->
<!--          v-model="queryParams.lastName"-->
<!--          placeholder="请输入last_name"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="phone" prop="phone">-->
<!--        <el-input-->
<!--          v-model="queryParams.phone"-->
<!--          placeholder="请输入phone"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="international_format_phone" prop="internationalFormatPhone">-->
<!--        <el-input-->
<!--          v-model="queryParams.internationalFormatPhone"-->
<!--          placeholder="请输入international_format_phone"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="email" prop="email">-->
<!--        <el-input-->
<!--          v-model="queryParams.email"-->
<!--          placeholder="请输入email"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="status" prop="transStatus">-->
<!--        <el-select v-model="queryParams.transStatus" placeholder="请选择status" clearable size="small">-->
<!--          <el-option label="请选择字典生成" value=""/>-->
<!--        </el-select>-->
<!--      </el-form-item>-->
<!--      <el-form-item label="domain" prop="domain">-->
<!--        <el-input-->
<!--          v-model="queryParams.domain"-->
<!--          placeholder="请输入domain"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="created_at" prop="createdAt">-->
<!--        <el-input-->
<!--          v-model="queryParams.createdAt"-->
<!--          placeholder="请输入created_at"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="paid_at" prop="paidAt">-->
<!--        <el-input-->
<!--          v-model="queryParams.paidAt"-->
<!--          placeholder="请输入paid_at"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="transaction_date" prop="transactionDate">-->
<!--        <el-input-->
<!--          v-model="queryParams.transactionDate"-->
<!--          placeholder="请输入transaction_date"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="updatedAt" prop="updatedat">-->
<!--        <el-input-->
<!--          v-model="queryParams.updatedat"-->
<!--          placeholder="请输入updatedAt"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="transfer_code" prop="transferCode">-->
<!--        <el-input-->
<!--          v-model="queryParams.transferCode"-->
<!--          placeholder="请输入transfer_code"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="integration" prop="integration">-->
<!--        <el-input-->
<!--          v-model="queryParams.integration"-->
<!--          placeholder="请输入integration"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="recipient_code" prop="recipientCode">-->
<!--        <el-input-->
<!--          v-model="queryParams.recipientCode"-->
<!--          placeholder="请输入recipient_code"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
<!--      <el-form-item label="reason" prop="reason">-->
<!--        <el-input-->
<!--          v-model="queryParams.reason"-->
<!--          placeholder="请输入reason"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
      <el-form-item label="state" prop="state">
        <el-select v-model="queryParams.state" placeholder="请选择state" clearable size="small">
          <el-option
            v-for="dict in stateOptions"
            :key="dict.dictValue"
            :label="dict.dictLabel"
            :value="dict.dictValue"
          />
        </el-select>
      </el-form-item>
<!--      <el-form-item label="time_spent" prop="timeSpent">-->
<!--        <el-input-->
<!--          v-model="queryParams.timeSpent"-->
<!--          placeholder="请输入time_spent"-->
<!--          clearable-->
<!--          size="small"-->
<!--          @keyup.enter.native="handleQuery"-->
<!--        />-->
<!--      </el-form-item>-->
      <el-form-item label="create date">
        <el-date-picker
          v-model="dateRange"
          size="small"
          style="width: 240px"
          value-format="yyyy-MM-dd"
          type="daterange"
          range-separator="-"
          start-placeholder="start time"
          end-placeholder="End time"
        ></el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['bizsys:ext_transfer_result:add']"
        >新增
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['bizsys:ext_transfer_result:edit']"
        >修改
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['bizsys:ext_transfer_result:remove']"
        >删除
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['bizsys:ext_transfer_result:export']"
        >导出
        </el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="ext_transfer_resultList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center"/>
      <el-table-column label="ID" align="center" prop="id"/>
      <el-table-column label="serial_no" align="center" prop="serialNo" width="300"/>
      <el-table-column label="event_type" align="center" prop="eventType"width="200"/>
      <el-table-column label="event_source" align="center" prop="eventSource" width="200"/>
      <el-table-column label="user_id" align="center" prop="userId" width="200"/>
      <el-table-column label="cust_no" align="center" prop="custNo" width="200"/>
      <el-table-column label="account_number" align="center" prop="accountNumber" width="200"/>
      <el-table-column label="account_name" align="center" prop="accountName" width="200"/>
      <el-table-column label="fees" align="center" prop="fees" width="200"/>
      <el-table-column label="requested_amount" align="center" prop="requestedAmount" width="200"/>
      <el-table-column label="amount" align="center" prop="amount" width="200"/>
      <el-table-column label="currency" align="center" prop="currency" width="200"/>
      <el-table-column label="bank_code" align="center" prop="bankCode" width="200"/>
      <el-table-column label="gateway_response" align="center" prop="gatewayResponse" width="200"/>
      <el-table-column label="bin" align="center" prop="bin" width="200"/>
      <el-table-column label="last4" align="center" prop="last4" width="200"/>
      <el-table-column label="exp_month" align="center" prop="expMonth" width="200"/>
      <el-table-column label="exp_year" align="center" prop="expYear" width="200"/>
      <el-table-column label="card_type" align="center" prop="cardType" width="200"/>
      <el-table-column label="country_code" align="center" prop="countryCode" width="200"/>
      <el-table-column label="brand" align="center" prop="brand" width="200"/>
      <el-table-column label="bank_name" align="center" prop="bankName" width="200"/>
      <el-table-column label="reusable" align="center" prop="reusable" width="200"/>
      <el-table-column label="authorization_code" align="center" prop="authorizationCode" width="200"/>
      <el-table-column label="channel" align="center" prop="channel" width="200"/>
      <el-table-column label="id" align="center" prop="transId" width="200"/>
      <el-table-column label="ip_address" align="center" prop="ipAddress" width="200"/>
      <el-table-column label="尝试次数" align="center" prop="attempts" width="200"/>
      <el-table-column label="authentication" align="center" prop="authentication" width="200"/>
      <el-table-column label="risk_action" align="center" prop="riskAction" width="200"/>
      <el-table-column label="customer_code" align="center" prop="customerCode" width="200"/>
      <el-table-column label="first_name" align="center" prop="firstName" width="200"/>
      <el-table-column label="middle_name" align="center" prop="middleName" width="200"/>
      <el-table-column label="last_name" align="center" prop="lastName" width="200"/>
      <el-table-column label="phone" align="center" prop="phone" width="200"/>
      <el-table-column label="international_format_phone" align="center" prop="internationalFormatPhone" width="200"/>
      <el-table-column label="email" align="center" prop="email" width="200"/>
      <el-table-column label="status" align="center" prop="transStatus" width="200"/>
      <el-table-column label="domain" align="center" prop="domain" width="200"/>
      <el-table-column label="created_at" align="center" prop="createdAt" width="200"/>
      <el-table-column label="paid_at" align="center" prop="paidAt" width="200"/>
      <el-table-column label="transaction_date" align="center" prop="transactionDate" width="200"/>
      <el-table-column label="updatedAt" align="center" prop="updatedat" width="200"/>
      <el-table-column label="source" align="center" prop="source" width="200"/>
      <el-table-column label="transfer_code" align="center" prop="transferCode" width="200"/>
<!--      <el-table-column label="integration" align="center" prop="integration" width="200"/>-->
      <el-table-column label="recipient_code" align="center" prop="recipientCode" width="200"/>
      <el-table-column label="reason" align="center" prop="reason" width="200"/>
      <el-table-column label="history" align="center" prop="history" width="200"/>
      <el-table-column label="state" align="center" prop="state" :formatter="stateFormat" width="100"/>
      <el-table-column label="remark" align="center" prop="remark" width="200"/>
      <el-table-column label="time_spent" align="center" prop="timeSpent" width="200"/>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['bizsys:ext_transfer_result:edit']"
          >修改
          </el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['bizsys:ext_transfer_result:remove']"
          >删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改交易数据对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="serial_no" prop="serialNo">
          <el-input v-model="form.serialNo" placeholder="请输入serial_no"/>
        </el-form-item>
        <el-form-item label="event_type" prop="eventType">
          <el-select v-model="form.eventType" placeholder="请选择event_type">
            <el-option label="请选择字典生成" value=""/>
          </el-select>
        </el-form-item>
        <el-form-item label="event_source" prop="eventSource">
          <el-input v-model="form.eventSource" placeholder="请输入event_source"/>
        </el-form-item>
        <el-form-item label="user_id" prop="userId">
          <el-input v-model="form.userId" placeholder="请输入user_id"/>
        </el-form-item>
        <el-form-item label="cust_no" prop="custNo">
          <el-input v-model="form.custNo" placeholder="请输入cust_no"/>
        </el-form-item>
        <el-form-item label="account_number" prop="accountNumber">
          <el-input v-model="form.accountNumber" placeholder="请输入account_number"/>
        </el-form-item>
        <el-form-item label="account_name" prop="accountName">
          <el-input v-model="form.accountName" placeholder="请输入account_name"/>
        </el-form-item>
        <el-form-item label="fees" prop="fees">
          <el-input v-model="form.fees" placeholder="请输入fees"/>
        </el-form-item>
        <el-form-item label="requested_amount" prop="requestedAmount">
          <el-input v-model="form.requestedAmount" placeholder="请输入requested_amount"/>
        </el-form-item>
        <el-form-item label="amount" prop="amount">
          <el-input v-model="form.amount" placeholder="请输入amount"/>
        </el-form-item>
        <el-form-item label="currency" prop="currency">
          <el-input v-model="form.currency" placeholder="请输入currency"/>
        </el-form-item>
        <el-form-item label="bank_code" prop="bankCode">
          <el-input v-model="form.bankCode" placeholder="请输入bank_code"/>
        </el-form-item>
        <el-form-item label="gateway_response" prop="gatewayResponse">
          <el-input v-model="form.gatewayResponse" placeholder="请输入gateway_response"/>
        </el-form-item>
        <el-form-item label="bin" prop="bin">
          <el-input v-model="form.bin" placeholder="请输入bin"/>
        </el-form-item>
        <el-form-item label="last4" prop="last4">
          <el-input v-model="form.last4" placeholder="请输入last4"/>
        </el-form-item>
        <el-form-item label="exp_month" prop="expMonth">
          <el-input v-model="form.expMonth" placeholder="请输入exp_month"/>
        </el-form-item>
        <el-form-item label="exp_year" prop="expYear">
          <el-input v-model="form.expYear" placeholder="请输入exp_year"/>
        </el-form-item>
        <el-form-item label="card_type" prop="cardType">
          <el-select v-model="form.cardType" placeholder="请选择card_type">
            <el-option label="请选择字典生成" value=""/>
          </el-select>
        </el-form-item>
        <el-form-item label="country_code" prop="countryCode">
          <el-input v-model="form.countryCode" placeholder="请输入country_code"/>
        </el-form-item>
        <el-form-item label="brand" prop="brand">
          <el-input v-model="form.brand" placeholder="请输入brand"/>
        </el-form-item>
        <el-form-item label="bank_name" prop="bankName">
          <el-input v-model="form.bankName" placeholder="请输入bank_name"/>
        </el-form-item>
        <el-form-item label="reusable" prop="reusable">
          <el-input v-model="form.reusable" placeholder="请输入reusable"/>
        </el-form-item>
        <el-form-item label="authorization_code" prop="authorizationCode">
          <el-input v-model="form.authorizationCode" placeholder="请输入authorization_code"/>
        </el-form-item>
        <el-form-item label="channel" prop="channel">
          <el-input v-model="form.channel" placeholder="请输入channel"/>
        </el-form-item>
        <el-form-item label="id" prop="transId">
          <el-input v-model="form.transId" placeholder="请输入id"/>
        </el-form-item>
        <el-form-item label="ip_address" prop="ipAddress">
          <el-input v-model="form.ipAddress" placeholder="请输入ip_address"/>
        </el-form-item>
        <el-form-item label="尝试次数" prop="attempts">
          <el-input v-model="form.attempts" placeholder="请输入尝试次数"/>
        </el-form-item>
        <el-form-item label="authentication" prop="authentication">
          <el-input v-model="form.authentication" placeholder="请输入authentication"/>
        </el-form-item>
        <el-form-item label="risk_action" prop="riskAction">
          <el-input v-model="form.riskAction" placeholder="请输入risk_action"/>
        </el-form-item>
        <el-form-item label="customer_code" prop="customerCode">
          <el-input v-model="form.customerCode" placeholder="请输入customer_code"/>
        </el-form-item>
        <el-form-item label="first_name" prop="firstName">
          <el-input v-model="form.firstName" placeholder="请输入first_name"/>
        </el-form-item>
        <el-form-item label="middle_name" prop="middleName">
          <el-input v-model="form.middleName" placeholder="请输入middle_name"/>
        </el-form-item>
        <el-form-item label="last_name" prop="lastName">
          <el-input v-model="form.lastName" placeholder="请输入last_name"/>
        </el-form-item>
        <el-form-item label="phone" prop="phone">
          <el-input v-model="form.phone" placeholder="请输入phone"/>
        </el-form-item>
        <el-form-item label="international_format_phone" prop="internationalFormatPhone">
          <el-input v-model="form.internationalFormatPhone" placeholder="请输入international_format_phone"/>
        </el-form-item>
        <el-form-item label="email" prop="email">
          <el-input v-model="form.email" placeholder="请输入email"/>
        </el-form-item>
        <el-form-item label="status">
          <el-radio-group v-model="form.transStatus">
            <el-radio label="1">请选择字典生成</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="domain" prop="domain">
          <el-input v-model="form.domain" placeholder="请输入domain"/>
        </el-form-item>
        <el-form-item label="created_at" prop="createdAt">
          <el-input v-model="form.createdAt" placeholder="请输入created_at"/>
        </el-form-item>
        <el-form-item label="paid_at" prop="paidAt">
          <el-input v-model="form.paidAt" placeholder="请输入paid_at"/>
        </el-form-item>
        <el-form-item label="transaction_date" prop="transactionDate">
          <el-input v-model="form.transactionDate" placeholder="请输入transaction_date"/>
        </el-form-item>
        <el-form-item label="updatedAt" prop="updatedat">
          <el-input v-model="form.updatedat" placeholder="请输入updatedAt"/>
        </el-form-item>
        <el-form-item label="source" prop="source">
          <el-input v-model="form.source" type="textarea" placeholder="请输入内容"/>
        </el-form-item>
        <el-form-item label="transfer_code" prop="transferCode">
          <el-input v-model="form.transferCode" placeholder="请输入transfer_code"/>
        </el-form-item>
        <el-form-item label="integration" prop="integration">
          <el-input v-model="form.integration" placeholder="请输入integration"/>
        </el-form-item>
        <el-form-item label="recipient_code" prop="recipientCode">
          <el-input v-model="form.recipientCode" placeholder="请输入recipient_code"/>
        </el-form-item>
        <el-form-item label="reason" prop="reason">
          <el-input v-model="form.reason" placeholder="请输入reason"/>
        </el-form-item>
        <el-form-item label="history" prop="history">
          <el-input v-model="form.history" type="textarea" placeholder="请输入内容"/>
        </el-form-item>
        <el-form-item label="state" prop="state">
          <el-select v-model="form.state" placeholder="请选择state">
            <el-option
              v-for="dict in stateOptions"
              :key="dict.dictValue"
              :label="dict.dictLabel"
              :value="dict.dictValue"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="remark" prop="remark">
          <el-input v-model="form.remark" placeholder="请输入remark"/>
        </el-form-item>
        <el-form-item label="time_spent" prop="timeSpent">
          <el-input v-model="form.timeSpent" placeholder="请输入time_spent"/>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listExt_transfer_result,
  getExt_transfer_result,
  delExt_transfer_result,
  addExt_transfer_result,
  updateExt_transfer_result,
  exportExt_transfer_result
} from "@/api/bizsys/ext_transfer_result";

export default {
  name: "Ext_transfer_result",
  components: {},
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 交易数据表格数据
      ext_transfer_resultList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // state字典
      stateOptions: [],
      // 日期范围
      dateRange: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        serialNo: null,
        eventType: null,
        eventSource: null,
        userId: null,
        custNo: null,
        accountNumber: null,
        accountName: null,
        fees: null,
        requestedAmount: null,
        amount: null,
        currency: null,
        bankCode: null,
        gatewayResponse: null,
        bin: null,
        last4: null,
        expMonth: null,
        expYear: null,
        cardType: null,
        countryCode: null,
        brand: null,
        bankName: null,
        reusable: null,
        authorizationCode: null,
        channel: null,
        transId: null,
        ipAddress: null,
        attempts: null,
        authentication: null,
        riskAction: null,
        customerCode: null,
        firstName: null,
        middleName: null,
        lastName: null,
        phone: null,
        internationalFormatPhone: null,
        email: null,
        transStatus: null,
        domain: null,
        createdAt: null,
        paidAt: null,
        transactionDate: null,
        updatedat: null,
        source: null,
        transferCode: null,
        integration: null,
        recipientCode: null,
        reason: null,
        history: null,
        state: null,
        timeSpent: null,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        serialNo: [
          {required: true, message: "serial_no不能为空", trigger: "blur"}
        ],
        eventType: [
          {required: true, message: "event_type不能为空", trigger: "change"}
        ],
        state: [
          {required: true, message: "state不能为空", trigger: "change"}
        ],
        createTime: [
          {required: true, message: "创建时间不能为空", trigger: "blur"}
        ],
        updateTime: [
          {required: true, message: "更新时间不能为空", trigger: "blur"}
        ]
      }
    };
  },
  created() {
    // this.getList();
    this.getDicts("state").then(response => {
      this.stateOptions = response.data;
    });
  },
  methods: {
    /** 查询交易数据列表 */
    getList() {
      this.loading = true;
      listExt_transfer_result(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
        this.ext_transfer_resultList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // state字典翻译
    stateFormat(row, column) {
      return this.selectDictLabel(this.stateOptions, row.state);
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        serialNo: null,
        eventType: null,
        eventSource: null,
        userId: null,
        custNo: null,
        accountNumber: null,
        accountName: null,
        fees: null,
        requestedAmount: null,
        amount: null,
        currency: null,
        bankCode: null,
        gatewayResponse: null,
        bin: null,
        last4: null,
        expMonth: null,
        expYear: null,
        cardType: null,
        countryCode: null,
        brand: null,
        bankName: null,
        reusable: null,
        authorizationCode: null,
        channel: null,
        transId: null,
        ipAddress: null,
        attempts: null,
        authentication: null,
        riskAction: null,
        customerCode: null,
        firstName: null,
        middleName: null,
        lastName: null,
        phone: null,
        internationalFormatPhone: null,
        email: null,
        transStatus: "0",
        domain: null,
        createdAt: null,
        paidAt: null,
        transactionDate: null,
        updatedat: null,
        source: null,
        transferCode: null,
        integration: null,
        recipientCode: null,
        reason: null,
        history: null,
        state: null,
        remark: null,
        timeSpent: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null,
        dateRange: []
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
      this.dateRange = [];
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加交易数据";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids
      getExt_transfer_result(id).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改交易数据";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateExt_transfer_result(this.form).then(response => {
              this.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addExt_transfer_result(this.form).then(response => {
              this.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$confirm('是否确认删除交易数据编号为"' + ids + '"的数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        return delExt_transfer_result(ids);
      }).then(() => {
        this.getList();
        this.msgSuccess("删除成功");
      })
    },
    /** 导出按钮操作 */
    handleExport() {
      const queryParams = this.queryParams;
      this.$confirm('是否确认导出所有交易数据数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        return exportExt_transfer_result(queryParams);
      }).then(response => {
        this.download(response.msg);
      })
    }
  }
};
</script>
